<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    

<script>

var obj1 = {
    name: '小错',
    age: 18,
    sex: '女',
    say: function (){
        console.log( 'hi' )
    }
}

// 访问对象的属性（成员）  .成员访问
 // 1.对象.属性
// 2.对象[属性]
console.log( obj1.name );// '小错'
console.log( obj1.sex );// '女'

// 访问不存在的变量会报错，访问对象不存在的属性不会报错，返回undefined
 console.log( obj1[name] );// undefined 此处的name是一个变量 
// console.log( obj1[sex] );// 报错 此处的sex是一个变量

console.log( obj1['name'] );// '小错'
console.log( obj1['sex'] );// '女'

var abc = 'sex';// 保存对象的属性名
console.log( obj1.abc );// undefined 此处abc为对象的属性名
console.log( obj1[abc] );// '女' 此处abc为一个变量
console.log( obj1['sex'] );// '女'  

obj1.say();
obj1['say'](); 


// 修改对象的属性(给属性重新赋值)
obj1.age = 19;
obj1['sex'] = '男';
console.log( obj1 );// {name: '小错', age: 19, sex: '男', say: ƒ}


// 对象可以动态添加属性方法
obj1.money = 200000;
obj1.hello = function (){
    console.log( 'hello' );
}
console.log( obj1 );// {name: '小错', age: 18, sex: '女', money: 200000, say: ƒ, hello: ƒ}


// 删除对象的属性
// delete obj1.age;
// console.log( obj1 );// {name: '小错', sex: '女', say: ƒ}


// 遍历对象（使用for/in）
// for (var key in obj1){
//     // console.log( key );// 'name'  'age'  'sex'  'say'

//     // console.log( obj1.key );// undefined
//     console.log( obj1[key] );// '小错'  18  '女'  f(){}
// }

</script>
</body>
</html>